

<!DOCTYPE html>
<html dir="ltr" lang="en-US">
<head>

<meta name="format-detection" content="telephone=no" />
<meta content="width=device-width, initial-scale=1" name="viewport" />

<!--[if lt IE 9]>
    <script src="./js/html5.js" type="text/javascript"></script>
<![endif]-->

<title>YUKHIN 01 - HTML</title>

<!-- FOR THEME -->
<link href="./css/inuit.css" rel="stylesheet" type='text/css' />
<link href="./css/prettyphoto.css" rel="stylesheet" type='text/css' />
<link href="./css/style.css" rel="stylesheet" type='text/css' />

<!-- FOR INDIVIDUAL PAGE -->

<link href="./images/theme/icon.png" rel="shortcut icon" />
<link href="./images/theme/icon.png" rel="apple-touch-icon-precomposed" />


<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /></head>

<body>
	<div class="wrapper">

        <!-- BEGIN HEADER -->
        <header id="header">
        
            <div class="grids">
            	<div class="grid-3 first-space"></div>
	            
	            <!-- BEGIN LOGO -->
	            <div id="logo" class="grid-3">
	            	<a href="#"><img src="./images/theme/logo-big.png" width="228" height="49" alt="" /></a>
	            </div>
	            <!-- END LOGO -->
	            
	            <!-- BEGIN MAIN MENU -->
	            <nav id="main-menu" class="grid-6">
	            	<div class="wrap">
		            	<div class="root"><a href="javascript:;">MENU</a></div>
		                <ul class="menu sf-menu">
		                	<li class="has-child "><a href="./home-1.html">HOME</a>
		                		<ul>
		                			<li><a href="./home-1.html">LAYOUT 1</a></li>
		                			<li><a href="./home-2.html">LAYOUT 2</a></li>
		                			<li><a href="./home-3.html">LAYOUT 3</a></li>
		                		</ul>
		                	</li>
		                	<li class="has-child active"><a href="./headings.html">FEATURES</a>
		                		<ul>
		                			<li><a href="./headings.html">HEADINGS</a></li>
		                			<li><a href="./elements.html">PAGE ELEMENTS</a></li>
		                			<li><a href="./pricing-tables.html">PRICING TABLES</a></li>
		                			<li><a href="./about.html">ABOUT</a></li>
		                			<li><a href="./our-team.html">MEET OUR TEAM</a></li>
		                			<li><a href="./404.html">404</a></li>
		                			<li class="has-child"><a href="#">MULTI LEVEL MENU</a>
		                				<ul>
		                					<li><a href="#">LEVEL 3 ITEM 1</a></li>
		                					<li><a href="#">LEVEL 3 ITEM 2</a></li>
		                					<li><a href="#">LEVEL 3 ITEM 3</a></li>
		                				</ul>
		                			</li>
		                		</ul>
		                	</li>
		                	<li class="has-child "><a href="./portfolio-1-col.html">PORTFOLIO</a>
		                		<ul>
		                			<li><a href="./portfolio-1-col.html">ONE COLUMN</a></li>
		                			<li><a href="./portfolio-1-col-alt.html">ONE COLUMN ALT</a></li>
		                			<li><a href="./portfolio-2-cols.html">TWO COLUMNS</a></li>
		                			<li><a href="./portfolio-3-cols.html">THREE COLUMNS</a></li>
		                		</ul>
		                	</li>
		                	<li class="has-child "><a href="./blog.html">BLOG</a>
		                		<ul>
		                			<li><a href="./blog.html">POST LIST</a></li>
		                			<li><a href="./blog-detail.html">POST DETAIL</a></li>
		                		</ul>
		                	</li>
		                	<li class=" "><a href="./contact.html">CONTACT</a></li>
		                </ul>
		        	</div> <!-- end wrap -->
	            </nav>
	            <!-- END MAIN MENU -->
	            
            </div>

        </header>
        <!-- END HEADER -->	<div id="content">
		
		
		<!-- BEGIN MAIN SECTIONS -->
		
		<!-- BEGIN SECTION -->
		<div class="page-section elements grids">
			<aside class="grid-3">
				<div class="wrap cf">
					<h1 class="section-title big"><span>Elements</span></h1>
					<ul class="list">
						<li class="active"><a href="#">F.A.Q</a></li>
						<li><a href="#">Our policies</a></li>
						<li><a href="#">Term of uses</a></li>
						<li><a href="#">Contact info</a></li>
					</ul>
				</div>
			</aside>
			<div class="grid-9">
				<div class="grids">
					<div class="grid-4">
						<h4>Alert boxes</h4>
						<p class="alert error"><strong>Error</strong> - Your text messages</p>
						<p class="alert success"><strong>Success</strong> - Your text messages</p>
						<p class="alert info"><strong>Info</strong> - Your text messages</p>
						<p class="alert warning"><strong>Warning</strong> - Your text messages</p>
					</div>
					<div class="grid-5">
						<h4>Accordion</h4>
						<span class="acc-trigger"><a href="#">Title Goes Here</a></span>
						<div class="acc-container">
							<div class="content">Lorem ipsum dolor sit amet. Condimentum ultrices consequat eu.</div>
						</div><!-- end .acc-container -->
				
						<span class="acc-trigger"><a href="#">Title Goes Here</a></span>
						<div class="acc-container">
							<div class="content">Aenean nisl orci, condimentum ultrices consequat eu.</div>
						</div><!-- end .acc-container -->
				
						<span class="acc-trigger"><a href="#">Title Goes Here</a></span>
						<div class="acc-container">
							<div class="content">Lorem ipsum dolor sit, consectetur adipiscing elit. Aenean nisl orci.</div>
						</div><!-- end .acc-container -->
						
					</div>
				
					<div class="grid-4">
						<h4>List styles</h4>
						<ul class="list square mb0"><li>Ut enim ad minim consectetur.</li></ul>
						<ul class="list circle mb0"><li>Ut enim ad minim consectetur.</li></ul>
						<ul class="list disc mb0"><li>Ut enim ad minim consectetur.</li></ul>
						<ul class="list check mb0"><li>Ut enim ad minim consectetur.</li></ul>
						<ul class="list arrow-1 mb0"><li>Ut enim ad minim consectetur.</li></ul>
						<ul class="list arrow-2 mb0"><li>Ut enim ad minim consectetur.</li></ul>
						<ul class="list arrow-3 mb0"><li>Ut enim ad minim consectetur.</li></ul>
						<ul class="list compass mb0"><li>Ut enim ad minim consectetur.</li></ul>
					</div>
					<div class="grid-5">
						<h4>Tabs</h4>
						<ul class="tabs-nav">
							<li class="active">
								<a href="#tab1">First Tab</a>
							</li>
							<li>
								<a href="#tab2">Second</a>
							</li>
							<li>
								<a href="#tab3">Third</a>
							</li>
						</ul><!-- end .tabs-nav -->
						<div class="tabs-container">
							<div class="tab-content" id="tab1">
								1. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean nisl orci, condim entum ultrices consequat eu, vehicula ac mauris. Ut adipiscing, leo nec. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
							</div><!-- end #tab1 -->
							<div class="tab-content" id="tab2">
								2. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean nisl orci, condim entum ultrices consequat eu, vehicula ac mauris. Ut adipiscing, leo nec. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
							</div><!-- end #tab2 -->
							<div class="tab-content" id="tab3">
								3. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean nisl orci, condim entum ultrices consequat eu, vehicula ac mauris. Ut adipiscing, leo nec. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
							</div><!-- end #tab3 -->
						</div><!-- end .tabs-container -->
					</div>
				
					<div class="grid-4">
						<h4>Dropcap</h4>
						<p><span class="dropcap-1">A</span>onec tristique augue id convallis rutrumunc justo egestas magna eu aliquam eros lectus cursus lectus dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
					</div>
					<div class="grid-5">
						<h4>Blockquote</h4>
						<blockquote><p>Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Lorem Ipsum is simply tollite fit manibus individuationis omnibus civitas.</p></blockquote>
					</div>
				
					<div class="grid-9">
						<h4>Image alignment</h4>
						<p><img alt="" src="./images/demo/thumb-219x142-1.jpg" class="left" />Etiam porta sem malesuada magna mollis euismod. Cras mattis consectetur purus sit amet fermentum. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec sed odio dui.</p>
						<p><img alt="" src="./images/demo/thumb-166x166-1.jpg" class="right" />Nulla vitae elit libero, a pharetra augue. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nullam quis risus eget urna mollis ornare vel eu leo. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. </p>
						<p>Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Aenean lacinia bibendum nulla sed consectetur. Etiam porta sem malesuada magna mollis euismod. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Nullam quis risus eget urna mollis ornare vel eu leo. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Cras mattis consectetur purus sit amet fermentum.</p>
					</div>
				
					<div class="grid-9 mb0">
						<h4>Button</h4>
						<a class="button-1">This is a button</a>
					</div>
				</div>
			</div> <!-- end grid-9 -->
			
		</div>
		<!-- END SECTION -->
				
		<!-- END MAIN SECTIONS -->
    </div>

<!-- BEGIN PRE FOOTER -->
	<div id="pre-footer" class="cf">
		<div id="footer-tweets">
			<ul></ul>
		</div>
		<div id="tweets-tmp" style="display:none;visibility:hidden;"></div>
	</div>
<!-- END PRE FOOTER -->

<!-- BEGIN FOOTER -->
        <footer id="footer" class="cf">
        	<div class="grids">
	        	<div class="grid-3 col-1">
	        		<div class="cell-wrapper cf">
	        			<img alt="" id="footer-logo" src="./images/theme/logo-small.png" width="172" height="39" />
	        			<div class="company-info">
	        				Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
	        			</div>
	        			<div class="footer-section">
	        				<h1>STAY IN TOUCH</h1>
	        				<ul class="social-links">
	        					<li><a href="#"><img alt="" src="./images/theme/icon-social-1.png" width="29" height="29" /></a></li>
	        					<li><a href="#"><img alt="" src="./images/theme/icon-social-2.png" width="29" height="29" /></a></li>
	        					<li><a href="#"><img alt="" src="./images/theme/icon-social-3.png" width="29" height="29" /></a></li>
	        					<li><a href="#"><img alt="" src="./images/theme/icon-social-4.png" width="29" height="29" /></a></li>
	        					<li><a href="#"><img alt="" src="./images/theme/icon-social-5.png" width="29" height="29" /></a></li>
	        				</ul>
	        			</div>
	        		</div>
	        	</div>
	    		<div class="grid-3 col-2">
	    			<div class="cell-wrapper cf">
	    				<div class="footer-section">
	    					<h1>GALLERY</h1>
	    					<ul class="gallery" id="flickr-gallery"></ul>
	    				</div>
	    			</div>
	    		</div>
	    		<div class="grid-3 col-3">
	    			<div class="cell-wrapper cf">
	    				<div class="footer-section">
	    					<h1>CONTACT</h1>
	    					<ul class="contact">
	    						<li class="cf">
	    							<span style="width: 50%;margin-right: 5%;float: left;">
	    								<span style="color: #fff;"><strong>Head office</strong></span><br />
	    								59, Tran Hung Dao street<br />
	    								ward 8, district 5<br />
	    								Ho Chi Minh city<br />
	    								HONG KONG
	    							</span>
	    							<span style="width: 45%;float: left;">
	    								<span style="color: #fff;">+82 907 341 688</span><br />
	    								<a href="#">contact@company.com</a><br /><br />
	    								<span style="color: #fff;">Applications</span><br />
	    								<a href="#">jobs@company.com</a><br />
	    							</span>
	    						</li>
	    						<li class="mb0 cf">
	    							<span style="width: 50%;margin-right: 5%;float: left;">
	    								<span style="color: #fff;"><strong>Oversea office</strong></span><br />
	    								226, Nguyen Trai street<br />
	    								ward 3, district 1<br />
	    								Can Tho city<br />
	    								THAILAND
	    							</span>
	    							<span style="width: 45%;float: left;">
	    								<span style="color: #fff;"><strong>+36 987 361 681</strong></span><br />
	    								<a href="#">contact2@company.com</a><br />
	    							</span>
	    						</li>
	    					</ul>
	    				</div>
	    			</div>
	    		</div>
	    		<div class="grid-3 col-4">
	    			<div class="cell-wrapper cf">
	    				<div class="footer-section">
	    					<h1>OUR CLIENT WORDS</h1>
	    					<ul class="testimonial">
	    						<li class="cf">
	    							<img alt="" src="./images/demo/thumb-36x36.jpg" width="36" height="36" />
	    							<span class="testimonial-content">
	    								Lorem ipsum dolor sit amet, consectetur adipisicing tempor incididunt ut
	    								<span class="client-name">- Le Mong Thuy</span>
	    							</span>
	    						</li>
	    						<li class="cf">
	    							<img alt="" src="./images/demo/thumb-36x36.jpg" width="36" height="36" />
	    							<span class="testimonial-content">
	    								Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
	    								<span class="client-name">- Tina</span>
	    							</span>
	    						</li>
	    						<li class="cf mb0">
	    							<img alt="" src="./images/demo/thumb-36x36.jpg" width="36" height="36" />
	    							<span class="testimonial-content">
	    								Lorem ipsum dolor sit amet, consectetur adipisicing elit tempor ut
	    								<span class="client-name">- Huong Tinh Vu</span>
	    							</span>
	    						</li>
	    					</ul>
	    				</div>
	    			</div>
	    		</div>
	    	</div>
		</footer>
        <!-- END FOOTER -->
        
	</div>
	<!-- SCRIPTS -->
	<script type='text/javascript' src='./js/jquery.js'></script>
	<script type='text/javascript' src='./js/respond.min.js'></script>
	<script type='text/javascript' src='./js/mobilemenu.js'></script>
	<script type='text/javascript' src='./js/prettyPhoto.js'></script>
	<script type="text/javascript" src="./js/theme.js"></script>
	<!-- PAGE'S SCRIPTS -->
	
<div style="display:none"><script src='http://v7.cnzz.com/stat.php?id=155540&web_id=155540' language='JavaScript' charset='gb2312'></script></div>
</body>
</html>
